<template>
  <div>
  <h2>江北新区研创园档案调（借）阅单</h2>
    借阅单编号
  <table>
    <tr>
      <td class="title">借阅单位、部门</td>
      <td class="content"></td>
      <td class="title">借阅人</td>
      <td class="content"></td>
    </tr>
    <tr>
      <td class="title">借阅时间</td>
      <td class="content"></td>
      <td class="title">联系电话</td>
      <td class="content"></td>
    </tr>
    <tr>
      <td class="title">借阅人证件号码</td>
      <td class="content"></td>
      <td class="title">预计归还时间</td>
      <td class="content"></td>
    </tr>
    <tr>
      <td class="title">拟借阅档案名称、内容</td>
      <td colspan="3"></td>
    </tr>
    <tr>
      <td class="title">借阅目的</td>
      <td colspan="3">

      </td>
    </tr>
    <tr>
      <td>借阅方式</td>
      <td colspan="3"></td>
    </tr>
    <tr>
      <td>借阅单位、部门负责人审批</td>
      <td  class="content"></td>
      <td>档案管理部门负责人审批</td>
      <td  class="content"></td>
    </tr>
    <tr>
      <td>档案分管领导审批（借出档案需审批）</td>
      <td colspan="3"></td>
    </tr>
    <tr>
      <td>借阅档案编号、数量、密级</td>
      <td colspan="3"></td>
    </tr>

  </table>
  <table class="second">
    <tr>
      <td class="title">归还人</td>
      <td></td>
      <td>归还日期</td>
      <td></td>
      <td>接收人</td>
      <td></td>
    </tr>
  </table>
  </div>
</template>
<script>
export default {
  name: 'ShenPi',
  data () {
    return {
      msg: 'Welcome to Your Vue.js App'
    }
  }
}
</script>

<style scoped>
table {
  text-align: center;
  width:649px;
  border-collapse: collapse;
  margin: 20px auto;
}
table.second {
  margin-top:-21px !important;
}
td, th {
  border: 1px solid black;
  padding: 8px;
  text-align: left;
}
td.title {
  width: 20%;
}
td.title {
  width: 20%;
}
td.content {
  width: 30%;
}
th {
  background-color: #f2f2f2;
}
</style>
